<template>
  <cu-custom bg-color="bg-white text-black" is-back bg-image="">
    <template #backText>返回</template>
  </cu-custom>
  <view class="container">
    <view class="cu-bar bg-white solid-bottom">
      <view class="action text-black text-bold">
        <text class="cuIcon-titles text-orange"></text>
        <text class="text-xl">工作经历</text>
      </view>
      <view class="action">
        <button
          class="cu-btn bg-gradual-blue shadow"
          form-type="submit"
          @click="save()"
        >
          保存
        </button>
      </view>
    </view>
  </view>
  <form>
    <view class="cu-form-group">
      <view class="title">公司名称</view>
      <input v-model="form.companyName" placeholder="请输入公司名称(必填)" />
    </view>
    <view class="cu-form-group">
      <view class="title">职业名称</view>
      <input v-model="form.jobName" placeholder="请输入职业名称(必填)" />
      <uni-data-select
        v-model="form.jobStatus"
        :localdata="range"
      ></uni-data-select>
    </view>
    <view class="cu-form-group">
      <view class="title">在职时间</view>
      <uni-datetime-picker v-model="form.time" :border="true" type="daterange">
      </uni-datetime-picker>
    </view>
    <view>
      <view class="title bg-white padding-sm">工作内容</view>
      <WangEditor v-model="form.content"></WangEditor>
    </view>
  </form>
</template>

<script setup lang="ts">
import { reactive, toRefs } from "vue";
import { onLoad } from "@dcloudio/uni-app";
const state: any = reactive({
  form: {
    time: ["2024-6", "2026-9"],
    companyName: "二仙桥技术有限公司",
    jobName: "产品技术经理",
    content: "主打一个摸鱼",
    jobStatus: null,
  },
});
let index: any = null;
let workExperience: any = [];

const { form } = toRefs(state);
onLoad((option: any) => {
  index = option.index;
  uni.getStorage({
    key: "workExperience",
    success: ({ data }) => {
      if (option.index) {
        form.value = data.data[index];
      }
      if (data?.data) {
        workExperience = data.data;
      }
    },
  });
  console.log(form);
});
const range = reactive([
  { value: 0, text: "全职" },
  { value: 1, text: "实习" },
  { value: 2, text: "兼职" },
]);
const save = () => {
  let data: any = null;
  if (index != undefined) {
    workExperience[index] = form.value;
    data = [...workExperience];
  } else {
    data = [...workExperience, form.value];
  }
  uni.setStorage({
    key: "workExperience",
    data: {
      data: data,
      type: 2,
    },
  });
  uni.switchTab({ url: "/pages/index/index" });
};
</script>

<style scoped lang="scss">
#editor {
  width: 100%;
  height: 300px;
  background-color: #cccccc;
}
</style>
